<template>
  <el-dialog v-model="addOrEditVisible" title="生成代码" :before-close="closeEditDialog" width="50%">
    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="160px" class="demo-ruleForm"
             :size="formSize" status-icon>
      <el-row>
        <el-col :span="24">
          <el-form-item label="数据库" prop="datasourceName">
            <el-input v-model="ruleForm.datasourceName" disabled/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="数据表" prop="tableName">
            <el-input v-model="ruleForm.tableName" disabled/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="类名称" prop="entityName">
            <el-input v-model="ruleForm.entityName"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="包名称" prop="packageName">
            <el-input v-model="ruleForm.packageName"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="代码备注" prop="codeGenComment">
            <el-input v-model="ruleForm.codeGenComment"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="ruleForm.remark" type="textarea"/>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="closeEditDialog">关闭</el-button>
        <el-button type="primary" @click="submitForm(ruleFormRef)">提交</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script lang="ts" setup>
import {reactive, ref} from 'vue'
import type {FormInstance, FormRules} from 'element-plus'
import {ElMessage} from "element-plus";
import router from "@/router";
import {CodeGen} from '@/apis/model/system/CodegenModel';
import {createCodeGen, insertCodeGen, updateCodeGen} from '@/apis/http/system/CodegenHttp';

interface Prop {
  addOrEditVisible: boolean,
  ruleForm: CodeGen,
  addDataType: string
}

// 刷新list页面
const refushList = ref(false);

// 传递过来的参数
const props = defineProps<Prop>();

const emit = defineEmits(["closeEditDialog"]);


// 关闭按钮
const closeEditDialog = () => {
  emit("closeEditDialog", {
    addOrEditVisible: !props.addOrEditVisible,
    refushList: refushList.value
  })
}
const formSize = ref('default')
const ruleFormRef = ref<FormInstance>()
const rules = reactive<FormRules>({
  entityName: [
    {required: true, message: '请输入类名称', trigger: 'blur'}
  ],
  packageName: [
    {required: true, message: '请输入包名称', trigger: 'blur'}
  ],
  codeGenComment: [
    {required: true, message: '请输入代码备注', trigger: 'blur'}
  ]
})

const submitForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      createCodeGen(props.ruleForm).then(res => {
        const code = res.code;
        const message: string = res.message;
        const data = res.data;
        if (code == 200) {
          ElMessage({
            message: '生成代码成功！',
            type: 'success',
          })
          refushList.value = true
          closeEditDialog()
        } else {
          ElMessage.error('生成代码失败！')
        }
      })
    }
  })
}
</script>

<style scoped>
.dialog-footer button:first-child {
  margin-right: 10px;
}
</style>
